<template>
  <div>
    商品名字：
    <el-input v-model="goodsName" style="width: 60px"></el-input>


    生产起始时间：
    <el-date-picker v-model="startTime" type="date" placeholder="选择日期" value-format="YYYY--MM--DD"/>
    生产结束时间：
    <el-date-picker v-model="endTime" type="date" placeholder="选择日期" value-format="YYYY--MM--DD"/>
    <el-button type="primary" @click="select()">
      <el-icon class="el-icon--left">
        <Search/>
      </el-icon>
    </el-button>
  </div>
  <div >
    <el-table :data="goodsList"  >

      <el-table-column prop="goodsName"></el-table-column>
      <el-table-column prop="goodsPrice"></el-table-column>
      <el-table-column prop="goodsPhoto">
        <template #default="scope">
          <el-image :src="profilePath+scope.row.goodsPhoto" style="width: 60px;height: 60px"></el-image>
        </template>
      </el-table-column>

      <el-table-column label="操作">
        <template #default="scope">
          <el-button type="primary" @click="selectByGoods(scope.row)">查看</el-button>
          <el-button type="primary" @click="buyGoods(scope.row)">购买</el-button>
        </template>


      </el-table-column>


    </el-table>

    <el-pagination v-model:current-page="curPage" @current-change="handleCurrentChange" v-model:page-size="pageSize"
                   background :total="total">

    </el-pagination>


  </div>


</template>

<script>
import servicePath from "../serviceConfig";
import axios from "axios";

export default {
  name: "Home",
  data() {
    return {
      goodsName: '',
      profilePath: servicePath,
      startTime: '',
      endTime: '',
      curPage: 1,
      pageSize: 5,
      total: 0,
      goodsList: []
    }

  },
  created() {
    this.selectGoods();
  },
  methods: {

    selectGoods() {
      let param = new URLSearchParams();
      param.append("pageNo", this.curPage);
      param.append("pageSize", this.pageSize);
      param.append("name", this.goodsName);


      param.append("startTime", this.startTime);
      param.append("endTime", this.endTime);


      axios.post("/api/goods/select", param).then(res => {


        this.goodsList = res.data.records;
        this.total = res.data.total
        this.goodsName = ''

        this.startTime = ''
        this.endTime = ''
      })


    },
    selectByGoods() {
      this.$router.push('/details')

    }


  }

}
</script>

<style scoped>

</style>